import { defineConfig } from 'vite';
import { readFileSync } from 'fs';
import { FileSystemIconLoader } from 'unplugin-icons/loaders';
import AutoImport from 'unplugin-auto-import/vite';
import Components from 'unplugin-vue-components/vite';
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
import { VantResolver } from '@vant/auto-import-resolver';
import Icons from 'unplugin-icons/vite';
import vue from '@vitejs/plugin-vue';
import requireTransform from 'vite-plugin-require-transform';
import path from "path";
import pxtovw from 'postcss-px-to-viewport-8-plugin';
import dayjs from 'dayjs';

/* 读取版本号 */
const packageJson = JSON.parse(readFileSync(path.resolve(__dirname, 'package.json'), 'utf-8'));

/* 打包配置 */
const timeStamp = dayjs().format('MMDDHHmm').toString();
const specialName = 'toolsSpecialName-';
const Tools = [
  'vant',//这个即便隔离每次打包都不一样
  'axios', 'dayjs', 'echarts', 'vue-echarts',
  'js-cookie', 'ts-md5', 'vue-router', 'heic2any', 'hammerjs', 'pinia',
  'colorthief',
];
// https://vitejs.dev/config/
export default defineConfig({
  base: '/',
  plugins: [
    vue(),
    requireTransform({
      fileRegex: /.ts$|.vue$/,
    }), //   使用require形式引入图片
    Icons({
      compiler: "vue3",
      autoInstall: true,
      customCollections: {
        svg: FileSystemIconLoader('src/assets/svg'),//使用方式：'~icons/svg/【svg图片名称，不要后缀】'
      }
    }),
    AutoImport({
      resolvers: [VantResolver(),ElementPlusResolver()],
    }),
    Components({
      resolvers: [VantResolver(),ElementPlusResolver()],
    }),
  ],
  define: {
    __APP_VERSION__: JSON.stringify(packageJson.version),
  },
  resolve: {
    alias: {
      '@': path.resolve(__dirname, './src'),
    }
  },
  server: {
    cors: true, // 默认启用并允许任何源
    open: true, // 在服务器启动时自动在浏览器中打开应用程序
    //反向代理配置，注意rewrite写法，开始没看文档在这里踩了坑
    proxy: {
      '/api': {
        // target: "http://test.ieieye.com/",
        target: "http://shcapp.ieieye.com/",
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/api/, ''),
      },
    },
    host: "0.0.0.0",
    port: 8080,
  },
  build: {
    chunkSizeWarningLimit: 2048,
    reportCompressedSize: false,
    /* 请不要随意更改此处打包项，
    * 此处处理了公众号的缓存入口文件的问题，打包的时候生成新文件，但是不能删除旧的文件，让缓存了旧入口文件的用户能正常访问而不是白屏
    * 用户想要看到新页面，
      1、清理公众号的缓存即可拿到新页面
      2、或者公众号自带的刷新能拿到新页面（只生效当前一次，退出再次访问还是旧页面）
      3、第二天往后能拿到新页面
    * 可以定期清理旧的部分打包文件，按时间文件夹直接删除几个，留下最新几个时间的文件夹就行
    */
    emptyOutDir: false,
    rollupOptions: {
      output: {
        entryFileNames: `${ timeStamp }/[name]-[hash].js`,
        // assetFileNames: `${ timeStamp }/[ext]/[name]-[hash].[ext]`,
        assetFileNames: ({ name }) => {
          if (name.includes(specialName)) {
            const tool = Tools.find(item => name.includes(item));
            return `tools/assets/${ tool }-[hash].[ext]`;
          } else {
            return `${ timeStamp }/[ext]/${ name }-[hash].[ext]`;
          }
        },
        // chunkFileNames: `${ timeStamp }/[name]-[hash].js`,
        chunkFileNames: ({ name }) => {
          if (name.includes(specialName)) {
            const tool = Tools.find(item => name.includes(item));
            return `tools/js/${ tool }-[hash].js`;
          } else {
            return `${ timeStamp }/js/${ name }-[hash].js`;
          }
        },
        manualChunks: (id: string, {}) => {
          if (id.includes('node_modules')) {
            const name = Tools.find(item => id.includes(item));
            if (name) {
              return `${ specialName }${ name }`;
            }
          }
        },
      },
    },
  },
  css: {
    postcss: {
      plugins: [
        pxtovw({
          viewportWidth: 375,
          unitPrecision: 6,
          exclude: [/node_modules|monitor\/pages/], //忽略那些文件转换
          // exclude:[/node_modules\/vant/i],
          // exclude: [/^(?!.*node_modules\/vant)/] //忽略除vant之外的
        })
      ],
    },
  }
})
